<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>测试Markdown转换</title>
    <style>
        body { font-family: Arial, sans-serif; max-width: 800px; margin: 0 auto; padding: 20px; }
        .container { margin-top: 20px; }
        textarea { width: 100%; height: 300px; padding: 10px; }
        button { padding: 10px 20px; background-color: #4CAF50; color: white; border: none; cursor: pointer; }
        #result { margin-top: 20px; padding: 10px; background-color: #f5f5f5; }
    </style>
</head>
<body>
    <h1>测试Markdown转换</h1>
    <div class="container">
        <h2>文本转换</h2>
        <textarea id="markdownInput"># 一级标题1
# 一级标题2
# 一级标题3</textarea>
        <br>
        <input type="text" id="fileName" placeholder="文件名" value="test">
        <button onclick="convertText()">转换文本</button>
        
        <h2>文件上传</h2>
        <input type="file" id="fileUpload" accept=".md">
        <button onclick="uploadFile()">上传转换</button>
    </div>
    <div id="result"></div>

    <script>
        function convertText() {
            const markdown = document.getElementById('markdownInput').value;
            const fileName = document.getElementById('fileName').value;
            const resultDiv = document.getElementById('result');

            fetch(`/api/markdown/to-mindmap?fileName=${encodeURIComponent(fileName)}`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'text/plain'
                },
                body: markdown
            })
            .then(response => {
                if (!response.ok) {
                    throw new Error('网络响应错误');
                }
                return response.json();
            })
            .then(data => {
                resultDiv.innerHTML = `<pre>${JSON.stringify(data, null, 2)}</pre>`;
            })
            .catch(error => {
                resultDiv.innerHTML = `错误: ${error.message}`;
            });
        }

        function uploadFile() {
            const fileInput = document.getElementById('fileUpload');
            const resultDiv = document.getElementById('result');

            if (!fileInput.files || fileInput.files.length === 0) {
                resultDiv.innerHTML = '请选择一个文件';
                return;
            }

            const file = fileInput.files[0];
            const formData = new FormData();
            formData.append('file', file);

            fetch('/api/markdown/upload', {
                method: 'POST',
                body: formData
            })
            .then(response => {
                if (!response.ok) {
                    throw new Error('网络响应错误');
                }
                return response.json();
            })
            .then(data => {
                resultDiv.innerHTML = `<pre>${JSON.stringify(data, null, 2)}</pre>`;
            })
            .catch(error => {
                resultDiv.innerHTML = `错误: ${error.message}`;
            });
        }
    </script>
</body>
</html>